﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="mfChatMessageList.aspx.cs" Inherits="msBsc.WebUi.mMall.Buyer.mfChatMessageList" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>手机地接客商城</title>
    <%=getMeta()%>
    <link rel="stylesheet" type="text/css" href="/themes/mStyle1/mGlobal.css" charset="gbk" />
    <link rel="stylesheet" type="text/css" href="/themes/mStyle1/css/home/base.css" charset="gbk" />
    <link href="/themes/mStyle1/css/public/mChatMessageList.css" rel="stylesheet" charset="gbk" />
    <%=getBodyBeforeJs()%>
    <style type="text/css">
        .messgeCount {
            background: red none repeat scroll 0 0;
            border-radius: 50%;
            color: #fff;
            display: none;
            height: 30px;
            line-height: 30px;
            margin-right: 5px;
            text-align: center;
            width: 30px;
        }

        .ulr_message {
            display: table-cell;
            width: 35px;
            vertical-align: middle;
        }
    </style>
</head>
<body>
    <div class="viewport" style="background: #edeeee;">
        <%=msBsc.WebUi.Code.QtHtmlGet.GetWapHeaderMenuHtml(true) %>
        <form action='#' method="post" id="J_EmailForm">
           <%-- <div class="pageInfo">
                共有未读
                <span id="sumCount" style="color: red">0</span>
                条消息
            </div>--%>
            <ul class="m_chat" id="chat_list">
            </ul>
            <xmp id="svc_list_temp_message" style="display: none">
                {{#for(var i=0,len=d.rows.length;i < len;i++){ }}
              <li>
                    <div class="u_head">
                        <a class="ul_img_head" href="/mb_ChatMessage.htm?receiveId={{d.rows[i].id}}&receiveName={{d.rows[i].name}}">
                            <img src="{{d.rows[i].face}}" />
                        </a>

                    </div>
                    <div class="ulc_message">
                        <a class="ulc_messageInfo" href="/mb_ChatMessage.htm?receiveId={{d.rows[i].id}}&receiveName={{d.rows[i].name}}">{{d.rows[i].name}}</a>
                    </div>
                  <div class="ulr_message"><a id="{{d.rows[i].id}}" class="messgeCount" href="#">33</a></div>
                </li>
                {{#} }}
                 </xmp>
        </form>

    </div>
    <!--start JS引用-->
    <script type="text/javascript" src="/jqPlugin/js/jquery-1.8.3.min.js" charset="gbk"></script>
    <script type="text/javascript" src="/jqPlugin/js/jBase.js" charset="gbk"></script>
    <script type="text/javascript" src="/jqPlugin/js/jBPage.js" charset="gbk"></script>
    <script type="text/javascript" src="/themes/Style1/jsQt.js" charset="gbk"></script>
    <script type="text/javascript" src="/jqPlugin/js/laytpl.js" charset="gbk"></script>
    <script type="text/javascript" src="/themes/wStyle1/js/comm/VerifyJs.js" charset="gbk"></script>
    <script type="text/javascript" src="/themes/wStyle1/js/comm/DateInfo.js" charset="gbk"></script>
    <!--end JS引用-->
    <script type="text/javascript">
        (function () {
            $("#h_title").text("消息列表");
            //$.getMessageCount();


        })();
        var dataList = new Array();
        function showMessageList(data) {
            //$("#sumCount").text(data.rows.length)
            var _html = $('#svc_list_temp_message').html();
            laytpl(_html).render(data, function (render) {
                $('#chat_list').html(render);
            });
            for (var i = 0; i < data.rows.length; i++) {
                dataList.push(data.rows[i].id);
            }
            getNewestMessage();
        }

        function showMessageCount(data) {
            if (IsNull(data)) {
                return;
            }
            if (IsNull(data.rows) || data.rows.length < 1) {
                return;
            }
            for (var i = 0; i < data.rows.length; i++) {
                if (dataList.indexOf(data.rows[i].id) > -1) {
                    $("#" + data.rows[i].id).text(data.rows[i].msgCount);
                    $("#" + data.rows[i].id).css("display", "block");
                    //var htm = "<li><div class='u_head'><a class='ul_img_head' href='/mb_ChatMessage.htm?receiveId=" + data.rows[i].id + "&receiveName=" + data.rows[i].name + "'><img src='" + data.rows[i].face + "' /></a></div><div class='ulc_message'><a class='ulc_messageInfo' href='/mb_ChatMessage.htm?receiveId=" + data.rows[i].id + "&receiveName=" + data.rows[i].name + "'>" + data.rows[i].name + "</a></div><div class='ulr_message'><a id='" + data.rows[i].id + "' class='messgeCount' href='#'>" + data.rows[i].msgCount + "</a></div></li>";
                    //$("#chat_list").prepend(htm);
                    //$("#" + data.rows[i].id).css("display", "block");
                    //alert(htm);
                }
                else {
                    var htm = "<li><div class='u_head'><a class='ul_img_head' href='/mb_ChatMessage.htm?receiveId=" + data.rows[i].id + "&receiveName=" + data.rows[i].name + "'><img src='" + data.rows[i].face + "' /></a></div><div class='ulc_message'><a class='ulc_messageInfo' href='/mb_ChatMessage.htm?receiveId=" + data.rows[i].id + "&receiveName=" + data.rows[i].name + "'>" + data.rows[i].name + "</a></div><div class='ulr_message'><a id='" + data.rows[i].id + "' class='messgeCount' href='#'>" + data.rows[i].msgCount + "</a></div></li>";
                    $("#chat_list").prepend(htm);
                    $("#" + data.rows[i].id).css("display", "block");
                }
            }
        }

        function getNewestMessage() {
            var opart = new jsonRow();
            opart.AddCell("ACTION", "newestMessage");
            ajaxComm(opart);
            setTimeout("getNewestMessage()", 5000);
        }

        function getMessage() {
            var opart = new jsonRow();
            opart.AddCell("ACTION", "init");
            opart.AddCell("number", "10");
            ajaxComm(opart);
        }
        getMessage();
    </script>
</body>
<%=getBodyAfterJs() %>
</html>
